<template>
  <van-icon
    :color="value ? '#ffa500' : ''"
    :name="value ? 'star':'star-o'"
    @click="onCollect"
  />
</template>

<script>
import { addCollect, deleteCollect } from '@/api/user'

export default {
  name: 'collect-article',
  props: {
    value: {
      type: Boolean,
      required: true
    },
    autId: {
      type: [Number, String],
      required: true
    }
  },
  methods: {
    async onCollect () {
      try {
        if(this.value) {
          await deleteCollect(this.autId)
        } else {
          await addCollect(this.autId)
        }

        this.$emit('input', !this.value)

        this.$toast(!this.value ? '收藏成功' : '取消收藏')
      } catch(err) {
        console.log(err)
      }
    }
  }
}
</script>

<style lang="less" scoped>

</style>
